<template>
	<el-dialog :title="title" :visible.sync="formVisible">
		<div style="text-align:center;">
			<div style="text-align:left; width:600px; margin:0 auto;">
				<el-form :model="modelData" label-width="100px" class="demo-ruleForm" style="width:60%;">
					<el-form-item label="类型" v-if="modelData.ID==0">
						<el-select v-model="modelData.DicType" placeholder="类型" class="handle-select mr10">
							<el-option v-for="item in dicTypes" :key="item.Id" :label="item.Name" :value="item.Id"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="类型" v-else>
						<el-select v-model="modelData.DicType" placeholder="类型" class="handle-select mr10" :disabled="true">
							<el-option v-for="item in dicTypes" :key="item.Id" :label="item.Name" :value="item.Id"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="编码">
						<el-input v-model="modelData.Code" :maxlength="20"></el-input>
					</el-form-item>
					<el-form-item label="内容">
						<textarea v-model="modelData.Value" placeholder="" style="width:160%; height:400px; padding: 3px; border-radius: 3px;"></textarea>
					</el-form-item>
				</el-form>
			</div>
		</div>
		<div style="clear:both;"></div>
		<div slot="footer" class="dialog-footer">
			<el-button @click="close()">关闭</el-button>
			<el-button type="primary" @click="save()">保存</el-button>
		</div>
	</el-dialog>
</template>

<script>
	import service from '../../../../js/common/dicservice.js'
	export default {
		props: {
			title: "",
			id: 0,
			visible: false,
			dicTypes: {
				type: Array
			}
		},
		data() {
			return {
				modelData: {},
				formVisible: this.visible
			}
		},
		created() {
			if(this.id > 0) {
				service.getModelData(this, this.id);
			}
		},
		methods: {
			close() {
				this.$emit('close');
			},
			save() {
				service.handleSave(this);
			}
		},
		watch: {
			visible(val) {
				this.formVisible = val;
			},
			formVisible(val) {
				if(!val) {
					this.$emit('close');
				}
			}
		}
	}
</script>